"use client";

import type { ReactNode } from "react";

export const H1 = ({ children }: { children: ReactNode }) => (
  <h1 className="text-[20px] font-[700] leading-[normal] not-italic mt-[16px]">
    {children}
  </h1>
);

export const H2 = ({ children }: { children: ReactNode }) => (
  <h2 className="text-[16px] font-[500] leading-[150%] not-italic mt-[16px]">
    {children}
  </h2>
);

export const H3 = ({ children }: { children: ReactNode }) => (
  <h3 className="text-[16px] not-italic font-[500] leading-[150%] mt-[16px]">
    {children}
  </h3>
);

export const P = ({ children }: { children: ReactNode }) => (
  <p className="text-[rgba(255,255,255,0.60)] text-[12px] font-[400] leading-[150%] not-italic mt-[16px]">
    {children}
  </p>
);

export const Email = () => (
  <a href={`mailto:${process.env.EMAIL}`} className="text-[#a5a5ff] underline">
    {process.env.EMAIL}
  </a>
);
